<!DOCTYPE html>
<html lang="en">
<head>

    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
    
    <title>REWORK - Responsive HTML Template Preview - Themeforest</title>
    
    <meta name="description" content="" />
    <meta name="author" content="" />
    
    <link rel="stylesheet" href="./css/style.css" media="screen" />
    <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,300,700" />
    <link rel="stylesheet" href="./css/flexslider.css" media="screen" />

    <script src="./js/jquery-1.7.2.min.js"></script>
    <script src="./js/jQuery.BlackAndWhite.min.js"></script>
    <script src="./js/jquery.easing-1.3.min.js"></script>
    <script src="./js/jquery.flexslider-min.js"></script>
    <script src="./js/jquery.isotope.min.js"></script>
    <script src="./js/jquery.jcarousel.min.js"></script>
    <script src="./js/jquery.touchSwipe.min.js"></script>
    <script src="./js/respond.min.js"></script>
    <script src="./js/selectnav.min.js"></script>
    <script src="./js/custom.js"></script>
    <script type="text/javascript" src="http://rework.reworkmedia.net/[JS library]"></script>
    <!--[if (gte IE 6)&(lte IE 8)]>
      <script type="text/javascript" src="./js/selectivizr-min.js"></script>
      <noscript><link rel="stylesheet" href="http://rework.reworkmedia.net/[fallback css]" /></noscript>
    <![endif]-->

    <script type="text/javascript">

      var _gaq = _gaq || [];
      _gaq.push(['_setAccount', 'UA-32209063-3']);
      _gaq.push(['_trackPageview']);

      (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
      })();

    </script>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></head>
<body>

<!-- Main Container -->
<div id="body-wrapper">

    <!-- Header -->
    <div id="header" class="container clearfix">

        <a href="./index.html" id="logo"><img src="./images/logo.png" alt="" /></a>

        <!-- Navigation -->
        <ul id="navigation">
            <li>
                <a href="./index.html">Home</a>
                <ul>
                    <li><a href="./homepage_v2.html">Simple Version</a></li>
                </ul>
            </li>
            <li>
                <a href="./about.html">Features</a>
                <ul>
                    <li><a href="./about.html">About Us</a></li>
                    <li><a href="./services.html">Services</a></li>
                    <li><a href="./pricing_tables.html">Pricing Tables</a></li>
                    <li><a href="./blog_post.html">Third Level Item<i></i></a>
                        <ul>
                            <li><a href="./blog_post.html">This is a simple example</a></li>
                            <li><a href="./blog_post.html">Of the third level</a></li>
                            <li><a href="./blog_post.html">Navigation item</a></li> 
                        </ul>
                    </li>
                    <li><a href="./shortcodes.html">Shortcodes</a></li>
                </ul>
            </li>
            <li class="current">
                <a href="./blog.html">Blog</a>
                <ul>
                    <li><a href="./blog_post.html">Single Post</a></li>
                    <li><a href="./blog_v2.html">Alternative Version</a></li>
                </ul>
            </li>
            <li>
                <a href="./portfolio_4_col.html">Portfolio</a>
                <ul>
                    <li><a href="./portfolio_2_col.html">2 Columns</a></li>
                    <li><a href="./portfolio_3_col.html">3 Columns</a></li>
                    <li><a href="./portfolio_4_col.html">4 Columns</a></li>
                    <li><a href="./portfolio_details.html">Single Project</a></li>
                    <li><a href="./portfolio_v2.html">Alternative Version</a></li>
                </ul>
            </li>
            <li>
                <a href="./contact.html">Contact</a>
            </li>
        </ul>
        <!-- /Navigation -->
        
    </div>
    <!-- /Header -->


    <!-- Content -->
    <div id="content" class="container clearfix">

        <h1 class="page-title-inner"><span class="section-title">Blog</span> Amazing things that<br /> bring <span class="accent">positive results</span></h1>

        <!-- Main Content -->
        <div id="main">

            <!-- Post -->
            <div class="post single clearfix">
                <h2>Publish What You Learn</h2>
                <ul class="post-meta">
                    <li class="author">By <a href="./blog_post.html">Howard Aiken</a></li>
                    <li class="date">July 9th, 2012</li>
                    <li class="tags"><a href="./blog_post.html">Browsers</a> · <a href="./blog_post.html">Internet Explorer</a> · <a href="./blog_post.html">Web</a></li>
                    <li class="comments"><a href="./blog_post.html">35 Comments</a></li>
                </ul>
                <div class="post-entry">
                    <img src="./images/content/blog_post_01.jpg" alt="" class="image" />
                    <p>
                        Nam ultricies dolor eu velit varius scelerisque. Vestibulum in lacus in felis pretium feugiat non sed elit. Duis pretium, urna sed pellentesque tincidunt, neque massa imperdiet nisi, sed cursus leo magna pretium elit. Proin bibendum ipsum a ante viverra lobortis. Phasellus id augue ligula, nec ultrices augue. Aliquam erat volutpat.
                    </p>
                    <blockquote class="wide">
                        Our Web site redesign was an extremely large and complicated project, and Harlo handled it beautifully. They walked us through each step of the process and were happy to answer questions.
                        <span class="corner"></span>
                    </blockquote>
                    <p>
                        Sed nunc tortor, sagittis quis viverra id, molestie vitae nibh. Donec vitae lacus sed risus accumsan consectetur ut a ligula. Etiam vitae nisi diam, in rutrum dui. In facilisis, erat sed laoreet aliquet, mauris urna placerat enim, eget varius nulla lacus ut erat. Mauris faucibus orci ac turpis facilisis et tempus metus venenatis. Pellentesque ornare, risus et vulputate mollis, massa nulla aliquam neque, sed hendrerit orci quam eget ante. Morbi pulvinar ligula at sapien ultricies hendrerit. Morbi mollis dictum libero at ultrices. Phasellus facilisis metus non dui tempor gravida. Proin fermentum sollicitudin ante, sed tempor eros molestie id. Donec volutpat odio eu mi imperdiet nec laoreet diam venenatis. Nunc ac purus aliquet mauris interdum accumsan.
                    </p>
                    <h3>What Can You Do About It?</h3>
                    <p>
                        Mauris pretium, metus eget porta dictum, mauris ipsum imperdiet erat, aliquam rhoncus mauris justo vehicula tellus. Vestibulum purus libero, tincidunt hendrerit tincidunt id, fermentum nec quam. Donec non orci nisl, non venenatis magna. Suspendisse ullamcorper orci ut erat faucibus a porta mauris facilisis. Aenean dui felis, fringilla at cursus et, porttitor a velit.
                    </p>
                    <p>
                        Vestibulum at velit lorem, et volutpat ante. Nulla facilisi. Nullam orci dui, dictum in congue et, hendrerit vel nibh. Ut eros magna, vulputate eget hendrerit et, euismod eu magna.
                    </p>
                </div>
            </div>
            <!-- /Post -->

            <!-- Comments -->
            <div id="comments">

                <h4>Comments (9)</h4>

                <ol class="comments-list">
                    <li class="comment">
                        <div>
                            <img src="./images/content/avatar_01.jpg" alt="" class="avatar" />
                            <div class="comment-meta">
                                <h5 class="author"><a href="./blog_post.html">Naomi</a> - <a href="./blog_post.html" class="reply">Reply</a></h5>
                                <p class="date">January 06, 2011</p>
                            </div>
                            <div class="comment-entry">
                                <p>Morbi dapibus arcu in massa tincidunt sodales. Donec accumsan turpis sit amet arcu ultricies elementum. Donec metus est, pellentesque vitae aliquam sed, aliquam vitae mauris. Aliquam laoreet velit imperdiet enim tincidunt viverra ac bibendum ante.</p>
                            </div>
                        </div>

                        <ul class="children">
                            <li class="comment">
                                <div>
                                    <img src="./images/content/avatar_02.jpg" alt="" class="avatar" />
                                    <div class="comment-meta">
                                        <h5 class="author"><a href="./blog_post.html">Norman</a> - <a href="./blog_post.html" class="reply">Reply</a></h5>
                                        <p class="date">January 06, 2011</p>
                                    </div>
                                    <div class="comment-entry">
                                        <p>Morbi dapibus arcu in massa tincidunt sodales. Donec accumsan turpis sit amet arcu ultricies elementum. Donec metus est, pellentesque vitae aliquam sed, aliquam vitae mauris. Aliquam laoreet velit imperdiet enim tincidunt viverra ac bibendum ante.</p>
                                    </div>
                                </div>

                                <ul class="children">
                                    <li class="comment">
                                        <div>
                                            <img src="./images/content/avatar_03.jpg" alt="" class="avatar" />
                                            <div class="comment-meta">
                                                <h5 class="author"><a href="./blog_post.html">Steve</a> - <a href="./blog_post.html" class="reply">Reply</a></h5>
                                                <p class="date">January 06, 2011</p>
                                            </div>
                                            <div class="comment-entry">
                                                <p>Morbi dapibus arcu in massa tincidunt sodales. Donec accumsan turpis sit amet arcu ultricies elementum. Donec metus est, pellentesque vitae aliquam sed, aliquam vitae mauris. Aliquam laoreet velit imperdiet enim tincidunt viverra ac bibendum ante.</p>
                                            </div>
                                        </div>
                                    </li>
                                </ul>

                            </li>
                        </ul>
                    </li>
                    <li class="comment">
                        <div>
                            <img src="./images/content/avatar_04.jpg" alt="" class="avatar" />
                            <div class="comment-meta">
                                <h5 class="author"><a href="./blog_post.html">Kate</a> - <a href="./blog_post.html" class="reply">Reply</a></h5>
                                <p class="date">January 06, 2011</p>
                                
                            </div>
                            <div class="comment-entry">
                                <p>Morbi dapibus arcu in massa tincidunt sodales. Donec accumsan turpis sit amet arcu ultricies elementum. Donec metus est, pellentesque vitae aliquam sed, aliquam vitae mauris. Aliquam laoreet velit imperdiet enim tincidunt viverra ac bibendum ante.</p>
                            </div>
                        </div>
                    </li>
                </ol>
                
                <!-- Comments Form -->
                <h4>Add a Comment</h4>

                <form method="post" id="comments-form" />
                    <input type="text" value="Name" name="name" default-value="Name" />
                    <input type="text" value="Email" name="email" default-value="Email" />
                    <textarea cols="88" rows="6" name="message" default-value="Message">Message</textarea>
                    <input type="submit" value="Add Comment" class="red" />
                </form>
                <!-- /Comments Form -->

            </div>
            <!-- /Comments -->

        </div>
        <!-- /Main Content -->

        <!-- Sidebar -->
        <div id="sidebar">

            <input type="text" value="Search" default-value="Search" class="search" />

            <!-- Blog Categories -->
            <div class="widget">
                <h5>Blog Categories</h5>
                <ul class="categories">
                    <li><a href="./blog_post.html">Branding</a></li>
                    <li><a href="./blog_post.html">Design Best Practices</a></li>
                    <li><a href="./blog_post.html">Performance</a></li>
                    <li><a href="./blog_post.html">Responsive Design</a></li>
                    <li><a href="./blog_post.html">Typography</a></li>
                    <li><a href="./blog_post.html">User Experience</a></li>
                </ul>
            </div>
            <!-- /Blog Categories -->

            <!-- Text Widget -->
            <div class="widget">
                <h5>Text Widget</h5>
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras dui orci, dapibus non luctus, ultrices vel nunc. Donec lacinia mattis erat sit amet blandit.</p>
            </div>
            <!-- /Text Widget -->

            <!-- Tabs Widget With Posts -->
            <div class="widget">
                <h5>Posts widget</h5>
                <ul id="tabs">
                    <li class="active"><a href="#tab1">Recent</a></li>
                    <li><a href="#tab2">Popular</a></li>
                </ul>
                <div id="tabs_content_container">
                    <div id="tab1" class="tab-content">
                        <ul class="posts">
                            <li>
                                <a href="http://rework.reworkmedia.net/single_post.html"><img src="./images/content/posts_widget_01.jpg" alt="" /></a>
                                <div class="entry">
                                   <a href="http://rework.reworkmedia.net/single_post.html">Lorem ipsum dolor sit, consectetuer.</a>
                                   <span class="date">July 8th, 2012</span>
                                </div>
                            </li>
                            <li>
                                <a href="http://rework.reworkmedia.net/single_post.html"><img src="./images/content/posts_widget_02.jpg" alt="" /></a>
                                <div class="entry">
                                   <a href="http://rework.reworkmedia.net/single_post.html">Nam ultricies dolor eu velit varius scelerisque.</a>
                                   <span class="date">July 5th, 2012</span>
                                </div>
                            </li>
                            <li>
                                <a href="http://rework.reworkmedia.net/single_post.html"><img src="./images/content/posts_widget_03.jpg" alt="" /></a>
                                <div class="entry">
                                   <a href="http://rework.reworkmedia.net/single_post.html">Vestibulum in lacus in felis pretium feugiat. </a>
                                   <span class="date">July 1th, 2012</span>
                                </div>
                            </li>
                        </ul>
                    </div>
                    <div id="tab2" class="tab-content">
                        <ul class="posts">
                            <li>
                                <a href="http://rework.reworkmedia.net/single_post.html"><img src="./images/content/posts_widget_04.jpg" alt="" /></a>
                                <div class="entry">
                                   <a href="http://rework.reworkmedia.net/single_post.html">Lorem ipsum dolor sit, consectetuer.</a>
                                   <span class="date">July 8th, 2012</span>
                                </div>
                            </li>
                            <li>
                                <a href="http://rework.reworkmedia.net/single_post.html"><img src="./images/content/posts_widget_05.jpg" alt="" /></a>
                                <div class="entry">
                                   <a href="http://rework.reworkmedia.net/single_post.html">Nam ultricies dolor eu velit varius scelerisque.</a>
                                   <span class="date">July 5th, 2012</span>
                                </div>
                            </li>
                            <li>
                                <a href="http://rework.reworkmedia.net/single_post.html"><img src="./images/content/posts_widget_06.jpg" alt="" /></a>
                                <div class="entry">
                                   <a href="http://rework.reworkmedia.net/single_post.html">Vestibulum in lacus in felis pretium feugiat. </a>
                                   <span class="date">July 1th, 2012</span>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <!-- /Tabs Widget With Posts -->

            <!-- Accordion -->
            <div class="widget">
                <h5>Accordion Widget</h5>
                <div class="accordion-button first" id="open"><a href="./blog_post.html">Website Design</a></div>
                <div class="accordion-content">
                    Lorem ipsum dolor sit amet nec, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes.
                </div>
                <div class="accordion-button"><a href="./blog_post.html">Website Development</a></div>
                <div class="accordion-content">
                    Lorem ipsum dolor sit amet nec, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes.
                </div>
                <div class="accordion-button"><a href="./blog_post.html">Content Management Systems</a></div>
                <div class="accordion-content">
                    Lorem ipsum dolor sit amet nec, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes.
                </div>
                <div class="accordion-button"><a href="./blog_post.html">E-Commerce</a></div>
                <div class="accordion-content">
                    Lorem ipsum dolor sit amet nec, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes.
                </div>
            </div>
            <!-- Accordion -->

            <!-- Twitter Feed -->
            <div class="widget">
                <h5>Latest Tweets</h5>
                <div class="twitter-feed">
                    <p>
                        12 Outstanding Videos That Make Good Creative Use of AudioJungle Tracks <a href="./blog_post.html">http://t.co/7USabnpS</a>
                        <span class="tweet-time">7 hours ago</span>
                    </p>
                    <p>
                        Farewell Envato – I Will Miss You! <a href="./blog_post.html">http://t.co/ommJTJgp</a>
                        <span class="tweet-time">Sep 5 (1 day ago)</span>
                    </p>
                </div>
            </div>
            <!-- /Twitter Feed -->

            <!-- Photo Stream -->
            <div class="widget">
                <h5>Flickr Feed</h5>
                <ul class="photo-stream">
                    <li><a href="./blog_post.html"><img src="./images/content/photo_stream_01.jpg" alt="" /></a></li>
                    <li><a href="./blog_post.html"><img src="./images/content/photo_stream_02.jpg" alt="" /></a></li>
                    <li><a href="./blog_post.html"><img src="./images/content/photo_stream_03.jpg" alt="" /></a></li>
                    <li><a href="./blog_post.html"><img src="./images/content/photo_stream_04.jpg" alt="" /></a></li>
                    <li><a href="./blog_post.html"><img src="./images/content/photo_stream_05.jpg" alt="" /></a></li>
                    <li><a href="./blog_post.html"><img src="./images/content/photo_stream_06.jpg" alt="" /></a></li>
                    <li><a href="./blog_post.html"><img src="./images/content/photo_stream_07.jpg" alt="" /></a></li>
                    <li><a href="./blog_post.html"><img src="./images/content/photo_stream_08.jpg" alt="" /></a></li>
                </ul>
            </div>
            <!-- /Photo Stream -->

        </div>
        <!-- /Sidebar -->

    </div>
    <!-- /Content -->

    <!-- Footer -->
    <div id="footer">
        <div class="container clearfix">

            <!-- About -->
            <div class="one-fourth">
                <a href="./index.html" class="logo"><img src="./images/logo_footer.png" alt="" /></a>
                <p>Proin fermentum sollicitudin ante, sed tempor eros molestie id. Donec volutpat odio eu mi imperdiet nec laoreet diam venenatis. Nunc ac purus aliquet mauris interdum accumsan.</p>
            </div>
            <!-- /About -->

            <!-- Twitter Feed -->
            <div class="one-fourth">
                <h5>Latest Tweets</h5>
                <div class="twitter-feed">
                    <p>
                        12 Outstanding Videos That Make Good Creative Use of AudioJungle Tracks <a href="./blog_post.html">http://t.co/7USabnpS</a>
                        <span class="tweet-time">7 hours ago</span>
                    </p>
                    <p>
                        Farewell Envato – I Will Miss You! <a href="./blog_post.html">http://t.co/ommJTJgp</a>
                        <span class="tweet-time">Sep 5 (1 day ago)</span>
                    </p>
                </div>
            </div>
            <!-- /Twitter Feed -->

            <!-- Contacts -->
            <div class="one-fourth">
                <h5>Contact Details</h5>
                <p class="address">3200 Sepulveda Blvd. <br />Manhattan Beach, CA 90266, USA</p>
                <p class="phone">Phone: (415) 124-5678 <br />Fax: (415) 124-5678</p>
                <p class="email">support@reworkmedia.com</p>
            </div>
            <!-- /Contacts -->

            <!-- Photo Stream -->
            <div class="one-fourth last">
                <h5>Photo Stream</h5>
                <ul class="photo-stream">
                    <li><a href="./blog_post.html"><img src="./images/content/photo_stream_01.jpg" alt="" /></a></li>
                    <li><a href="./blog_post.html"><img src="./images/content/photo_stream_02.jpg" alt="" /></a></li>
                    <li><a href="./blog_post.html"><img src="./images/content/photo_stream_03.jpg" alt="" /></a></li>
                    <li><a href="./blog_post.html"><img src="./images/content/photo_stream_04.jpg" alt="" /></a></li>
                    <li><a href="./blog_post.html"><img src="./images/content/photo_stream_05.jpg" alt="" /></a></li>
                    <li><a href="./blog_post.html"><img src="./images/content/photo_stream_06.jpg" alt="" /></a></li>
                    <li><a href="./blog_post.html"><img src="./images/content/photo_stream_07.jpg" alt="" /></a></li>
                    <li><a href="./blog_post.html"><img src="./images/content/photo_stream_08.jpg" alt="" /></a></li>
                </ul>
            </div>
            <!-- /Photo Stream -->

        </div>

        <div class="clear"></div>

        <div class="info container clearfix">

            <!-- Copyright -->
            <ul class="copyright">
                <li>© 2012 REWORK MEDIA. All rights reserved</li>
                <li><a href="./blog_post.html">Legal Notice</a></li>
                <li><a href="./blog_post.html">Terms & Conditions</a></li>
            </ul>
            <!-- /Copyright -->

            <!-- Social Links -->
            <ul class="social-links">
                <li class="twitter"><a href="./blog_post.html">Twitter</a></li>
                <li class="facebook"><a href="./blog_post.html">Facebook</a></li>
                <li class="linkedin"><a href="./blog_post.html">LinkedIn</a></li>
                <li class="digg"><a href="./blog_post.html">Digg</a></li>
                <li class="vimeo"><a href="./blog_post.html">Vimeo</a></li>
            </ul>
            <!-- /Social Links -->

        </div>
    </div>
    <!-- /Footer -->

</div>
<!-- /Main Container -->

</body>
</html>